@media screen and (min-width: 750px) {
    html {
        font-size: 75px !important;
    }
}

@media screen and (max-width: 320px) {
    html {
        font-size: 32px !important;
    }
}

body {
    background-color: #ededed;
    max-width: 750px;
    min-width: 320px;


}

html {
    overflow-x: hidden;
}

.banner {
    margin-top: -1.2rem;
    width: 10rem;
    height: 9.0667rem;
    position: relative;


    .q1 {
        position: relative;
        display: flex;
        top: .9333rem;
        z-index: 999;
        justify-content: space-between;

        >img {
            margin-top: .3373rem;
            margin-left: .3867rem;
            width: .8441rem;
            height: .8441rem;
        }

        >img:nth-child(2) {
            margin-right: .4267rem;
            margin-top: .3224rem;
        }
    }

    img {
        width: 100%;
    }

    .swiper-pagination {
        width: 1.1872rem;
        height: .6068rem;
        position: absolute;
        left: 8.4005rem;
        border-radius: .6rem;
        white-space: nowrap;
        line-height: .6068rem;
        background-color: rgba(51, 51, 51, 50%);
        white-space: nowrap;
        font-size: .32rem;


    }
}

.price {
    width: 10rem;
    height: 1.5568rem;
    background: url(../images/详情/1@2x.png);
    margin-top: 1.3333rem;

    ul {
        flex-direction: row;
        display: flex;
        justify-content: space-between;

        li:nth-child(1) {
            margin-top: .2042rem;
            display: flex;
            flex-direction: column;
            margin-left: .3067rem;

            i {
                width: 2.72rem;
                height: .88rem;
                font-family: PingFang SC;
                font-weight: 600;
                color: #ffffff;
                font-size: .3733rem;
                line-height: .48rem;

                >em {
                    font-weight: 600;
                    color: #ffffff;
                    font-size: .3733rem;
                    line-height: .48rem;
                }

                span {
                    font-size: .64rem;
                }
            }

            >span {
                white-space: nowrap;
                width: 2.1867rem;
                height: .4533rem;
                margin-top: -0.16rem;
                color: #ffffff;
                font-size: .32rem;
            }
        }

        li:nth-child(2) {
            display: flex;
            align-items: center;
            flex-direction: column;
            align-items: flex-end;
            margin-top: .2667rem;

            >span:nth-child(1) {
                width: 1.6rem;
                height: .4533rem;
                font-family: PingFang SC;
                color: #ffffff;
                font-size: .32rem;
                white-space: nowrap;
                margin-left: -0.5333rem;
                margin-right: .4rem;
            }

            span:nth-child(2) {

                margin-top: .16rem;
                display: flex;
                margin-right: .4rem;

                >em {
                    white-space: nowrap;
                    width: .2933rem;
                    height: .2933rem;

                    color: #ffffff;
                    font-size: .2133rem;


                }

                >i {

                    width: .32rem;
                    text-align: center;
                    height: .32rem;
                    border-radius: .0533rem;
                    background-color: #ffffff;
                    border-radius: .0533rem;
                    color: rgba(204, 37, 37, 1);
                    margin-left: .1333rem;
                    font-size: .2133rem;
                }

                >em {
                    color: rgba(255, 255, 255, 1);
                    text-align: center;
                }
            }


        }
    }

}

.coupon {

    width: 9.1467rem;
    height: .8rem;
    background-color: #fff1ea;
    margin: auto;
    margin-top: .4rem;

    ul {
        display: flex;
        justify-content: space-between;

        li {
            margin-top: .16rem;
            margin-left: .2133rem;

            img {
                width: 2.4533rem;
                height: .5333rem;
            }
        }

        li:nth-child(2) {
            margin-right: .5333rem;
            display: flex;
            justify-content: space-between;

            span:nth-child(1) {
                width: .64rem;
                height: .4533rem;
                font-family: PingFang SC;
                font-weight: 600;
                color: #ff6200;
                font-size: .32rem;
                white-space: nowrap;

                >span {

                    width: .1413rem;
                    margin-top: -0.0267rem;
                    height: .2828rem;
                    color: #fb5906;
                    margin-left: .0667rem;


                }


            }
        }
    }
}

.Featured {

    padding-top: .4667rem;
    box-sizing: border-box;
    width: 9.4133rem;
    height: 1.4933rem;
    font-family: PingFang SC;
    font-weight: 600;
    color: #202020;
    font-size: .4267rem;
    margin: auto;
    // background-color: red;

    span {
        margin: auto;

        img {
            margin-left: .0267rem;
            margin-top: .1067rem;
            width: .8rem;
            height: .3733rem;
        }

        .t2 {
            padding-top: .2667rem;
            // box-sizing: border-box;
            width: 1.8933rem;
            height: .5333rem;
        }
    }


}

.Specification {
    width: 10rem;
    // height: 7.2rem;
    background-color: #ffffff;
    border-radius: .2667rem;
    margin-top: 1.3333rem;
    // overflow: hidden;

    ul {
        li {
            margin-left: .3733rem;
            display: flex;
            justify-content: space-between;
            align-items: center;

            span:nth-child(1) {
                width: .8533rem;
                height: .5867rem;
                font-family: PingFang SC;
                font-weight: 600;
                color: #202020;
                font-size: .4267rem;
                white-space: nowrap;
                margin-top: .6rem;
            }

            >span:nth-child(2) {
                box-sizing: border-box;
                padding-top: 1.0667rem;
                box-sizing: border-box;

                margin-top: .2933rem;
                width: 5.2267rem;
                margin-left: -1.0667rem;
                height: .5867rem;
                font-family: PingFang SC;
                color: #494955;
                font-size: .4267rem;
                border-bottom: 2px solid #ededed;
                padding-bottom: 1.3333rem;
            }

            >img {
                width: .1869rem;
                height: .3205rem;
                margin-right: .4267rem;
            }
        }

        li:nth-child(2) {
            span:nth-child(1) {
                padding-top: .0267rem;

            }

            span:nth-child(2) {
                margin-left: -0.9333rem;


                >span {
                    color: #494955;
                    font-size: .3733rem;

                }
            }
        }
    }
}

.one {
    margin-top: .2667rem;

    width: 10rem;
    height: 1.7867rem;
    background-color: #ffffff;
    border-radius: .2667rem;
    // background-color: red;

    ul {
        width: 100%;
        display: flex;
        justify-content: space-between;
        // flex-direction: row;
        // align-items: center;
        margin-left: .3733rem;


        li:nth-child(1) {
            width: .8533rem;
            margin-top: .5333rem;
            height: .5867rem;
            font-family: PingFang SC;
            font-weight: 600;
            color: #202020;
            font-size: .4267rem;
            white-space: nowrap;


        }


        li:nth-child(2) {
            // align-items: center;
            display: flex;
            // justify-items: center;
            margin-right: .6667rem;

            span {
                margin-top: .3467rem;
                margin-left: .8rem;
                // width: 56px;
                // height: 40px;
                font-family: PingFang SC;
                color: #494955;
                text-align: center;
                font-size: .3733rem;

                i {
                    width: .64rem;
                    height: .4533rem;
                    font-family: PingFang SC;
                    color: #b0b8c2;
                    font-size: .32rem;
                }
            }
        }
    }
}

.Comment {
    margin-top: .4rem;
    width: 10rem;
    // height: 9.92rem;
    background-color: #ffffff;


    ul {
        display: flex;
        justify-content: space-between;

        li {
            margin-top: .5333rem;
        }

        li:nth-child(1) {
            display: flex;
            margin-left: .4rem;

            >img {
                width: .1333rem;
                height: .48rem;
                background-color: #fd444c;
                border-radius: .5333rem;

            }

            span {
                margin-top: -0.0267rem;
                white-space: nowrap;
                margin-left: .1067rem;
                width: 4.64rem;
                height: .5867rem;
                font-family: PingFang SC;
                font-weight: 600;
                color: #202020;
                font-size: .4267rem;
            }
        }

        li:nth-child(2) {
            margin-right: .4533rem;


            span {
                width: 1.7067rem;
                height: .5867rem;
                font-family: PingFang SC;
                color: #b0b8c2;
                font-size: .4267rem;
            }

            >img {
                margin-left: .5333rem;
                width: .1413rem;
                height: .2828rem;


            }

        }
    }

    ul:nth-child(2) {
        li {
            display: flex;
            margin-left: .7733rem;


            span:nth-child(1) {
                background-color: #f2f2f2;
                border-radius: .1333rem;
                width: 2.88rem;
                height: .5333rem;
                font-family: PingFang SC;
                color: #202020;
                font-size: .3733rem;
            }

            span:nth-child(2) {
                background-color: #f2f2f2;
                border-radius: .1333rem;
                margin-left: .6667rem;
                width: 3.2rem;
                height: .5333rem;
                font-family: PingFang SC;
                color: #202020;
                font-size: .3733rem;
            }
        }
    }

    ul:nth-child(3) {
        display: flex;
        justify-content: space-between;

        li:nth-child(1) {
            display: flex;
            margin-left: .4533rem;

            img {
                width: 1.0667rem;
                height: 1.0667rem;
            }

            span {
                margin-left: .1333rem;
                margin-top: .2667rem;
                width: .8rem;
                height: .4533rem;
                font-family: PingFang SC;
                font-weight: 500;
                color: #000000;
                font-size: .32rem;
            }

            .img1 {
                margin-top: .28rem;
                width: 1.0689rem;
                height: .3432rem;
                margin-left: .0267rem;
                background-color: #ffffff;
            }
        }

        li:nth-child(2) {


            img {
                margin-top: .2667rem;
                margin-left: .0267rem;
                width: .32rem;
                height: .32rem;
            }
        }
    }

    .Word1 {
        display: block;
        margin-top: .4rem;
        margin-left: .4rem;

        width: 9.04rem;
        height: 1.1733rem;
        font-family: PingFang SC;
        color: #494955;
        font-size: .4267rem;


    }

    .Word2 {
        width: 3.04rem;
        height: .5333rem;
        font-family: PingFang SC;
        color: #b0b8c2;
        font-size: .3733rem;
        margin-top: .1333rem;
        margin-left: .4rem;

    }

    ul:nth-child(4) {
        margin-top: .2667rem;
        display: flex;
        justify-content: space-between;

        li {
            margin-top: .5333rem;
        }

        li:nth-child(1) {
            display: flex;
            margin-left: .4rem;


            >img {
                width: .1333rem;
                height: .48rem;
                background-color: #fd444c;
                border-radius: .5333rem;
            }

            >span {

                margin-top: -0.0267rem;
                white-space: nowrap;
                margin-left: .1067rem;
                width: 4.64rem;
                height: .5867rem;
                font-family: PingFang SC;
                font-weight: 600;
                color: #202020;
                font-size: .4267rem;
            }

            li:nth-child(2) {
                >span {
                    width: 1.7067rem;
                    height: .5867rem;
                    font-family: PingFang SC;
                    color: #b0b8c2;
                    font-size: .4267rem;
                }

            }
        }
    }

    .ul5 {
        display: flex;



        >li {


            >img {

                margin-top: .08rem;

            }

            span {
                margin-left: -1.92rem;
                white-space: nowrap;
                margin-right: .1733rem;
            }
        }

    }
}

.commodity {
    margin-top: .2667rem;
    // background-color: pink;
    width: 10rem;


    background-color: #ffffff;
    border-radius: .2667rem;
    overflow: hidden;

    ul {
        display: flex;
        position: relative;
        margin-top: .48rem;
        justify-content: space-between;


        li:nth-child(1) {

            display: flex;
            align-items: center;

            >img {

                background-color: #fd444c;
                border-radius: .5333rem;
                width: .1333rem;
                height: .48rem;


                margin-left: .4rem;

            }

            >span {
                margin-left: .0533rem;
                width: 1.7067rem;
                height: .5867rem;
                font-family: PingFang SC;
                font-weight: 600;
                color: #2f2e2e;
                font-size: .4267rem;

            }


        }

        .li2 {
            margin-right: .4rem;

            img {
                width: .1413rem;
                height: .2828rem;

            }
        }
    }

    div {
        margin-top: .4rem;
        margin-left: .4rem;
        width: 3.52rem;
        display: flex;
        justify-content: space-between;
        // background-color: red;

        span:nth-child(1) {
            width: .7467rem;
            height: .5333rem;
            font-family: PingFang SC;
            font-weight: 600;
            color: #6a6c6b;
            font-size: .3733rem;
        }

        span:nth-child(2) {
            white-space: nowrap;
            width: .7467rem;
            height: .5333rem;
            font-family: PingFang SC;
            font-weight: 600;
            color: #202020;
            font-size: .3733rem;

        }


        .Graphics {

            img {

                width: .1333rem;
                height: .48rem;
                background-color: #fd444c;


            }

            span {

                width: 1.7067rem;
                height: .5867rem;

                font-weight: 600;
                color: #202020;
                margin-top: -0.0533rem;
                font-size: .4267rem;


            }
        }


    }
}


.bottom {
    img {
        width: 100%;
        height: 100%;
    }
}

.bottom_1 {

    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translate(-50%);
    width: 10rem;
    height: 1.4439rem;
    background-color: #ffffff;
    box-shadow: 0rem .0267rem 0 #dbdbdb inset;
    display: flex;
    justify-content: space-between;

    ul:nth-child(1) {

        display: flex;


        li {
            margin-top: .3487rem;
            margin-left: .2951rem;
            display: flex;
            flex-direction: column;
            align-items: center;

            img {
                width: .56rem;
                height: .4571rem;

                // background-color: #6a6c6b;
            }

            img:nth-child(2) {
                margin-left: .1333rem;
            }

            span {
                align-items: center;
                text-align: center;
                width: .64rem;
                height: .2933rem;
                font-family: PingFang SC;
                color: #323232;
                font-size: .2133rem;
                white-space: nowrap;
                // line-height: .4267rem;
            }
        }
    }

    ul:nth-child(2) {
        display: flex;

        li {
            width: 1.8667rem;
            height: .5333rem;
            font-family: PingFang SC;
            font-weight: 600;
            color: #f23a3a;
            font-size: .3733rem;
            line-height: .48rem;
            margin-top: .4467rem;
        }

        li:nth-child(2) {
            margin-left: 1.2rem;
            width: 3.3399rem;
            height: 1.4439rem;
            margin-top: 0;
            background-color: #ff6200;

            >span {
                display: block;
                white-space: nowrap;
                margin: .4467rem .9707rem .4639rem .8756rem;
                width: 1.4933rem;
                height: .5333rem;
                font-family: PingFang SC;
                font-weight: 600;
                color: #ffffff;
                font-size: .3733rem;

            }
        }
    }
}